<template>
  <div>
    <!-- 双向数据绑定有且只有一个 v-model ，只能使用在表单元素中，实现视图改变数据也跟着变 -->
    <input type="text" v-model="msg" />
    <!-- v-model 使用在复选框中时，如果只有一个复选框所取变量就是布尔值，但是多个复选框时就用value，且value不能相同，此时的变量是个数组，接收的就是每个value值 -->
    <input type="checkbox" v-model="flag" />
    <select v-model="city">
      <option>上海</option>
      <option>北京</option>
      <option>浙江</option>
    </select>
  </div>
</template>

<script>
export default {
  components: {},
  props: {},
  data() {
    return {
      msg: "我爱你，你爱我",
      flag: true,
      city: "北京",
    };
  },
  computed: {},
  watch: {},
  created() {},
  methods: {},
};
</script>

<style scoped></style>
